$main-max-width: 100%

$header-height: 80px

$features-h3-margin-bottom: 40px
$feature-box-div-margin-bottom: 0
$feature-box-div-width: 45%

@media screen and (min-width: 750px)
  p
    font-size: 16px
    line-height: 24px
    letter-spacing: 0.1px

  h1
    font-size: 36px
    line-height: 44px

  h3
    font-size: 28px
    line-height: 36px

  h4
    font-size: 24px
    line-height: 40px

  section, header, footer
    main
      .land
        margin: 60px;

  #searchbox
    margin-right: 30px

  #headSubMenu
    display: block
    text-align: center

    img
      max-height: 24px
      vertical-align: middle
      margin: 0 30px

  #docs
    #headSubMenu
      li
        a
          font-size: 1em
          font-weight: normal

        li + li
          margin-left: 60px

  #homeGrid
    h3
      text-align: left
      margin-bottom: 18px

    main
      position: relative
      clear: both
      display: table
      height: 160px

      .content
        display: table-cell
        position: relative
        vertical-align: middle

      .image-wrapper
        position: absolute
        top: -10px
        margin-left: 45%
        max-width: 25%
        max-height: 100%
        transform: translateY(-50%)

      img
        width: 100%

  #features
    padding-bottom: 60px

    .feature-box
      margin-bottom: 30px

      &:last-child
        margin-bottom: 0

    h3
      margin-bottom: $features-h3-margin-bottom

    .feature-box
      & > div
        width: $feature-box-div-width
        margin-bottom: $feature-box-div-margin-bottom

